<!-- 低碳生活 -->
@include('user.head')
<div class="wrapper">
	<div id="zx_content">
		<div class="bs-example bs-navbar-top-example" data-example-id="navbar-fixed-to-top">
		    <!--<nav class="navbar navbar-default">
		      <div class="container-fluid">
		        <div class="collapse navbar-collapse" id="bs-example-navbar-collapse-6">
		          <ul class="nav navbar-nav">
		            <li class="life_nav"><a href="#">全部</a></li>
		            <li class="life_nav"><a href="#">太阳能</a></li>
		            <li class="life_nav"><a href="#">净化器</a></li>
		            <li class="life_nav"><a href="#">空气能</a></li>
		          </ul>
		        </div>
		      </div>
		    </nav>-->
	    </div>
	    <div class="row no_margin" id="life">
		</div>
		<div class="wrapper-1">
			<div class="jiazai">
				<i class="fa fa-spinner fa-spin"></i>正在加载中，请稍后
			</div>
		</div>
	</div>
</div>
@include('user.footer')
@include('user.common')
</body>
<script type="text/html" id="lifeProduct">
{%each list as value index}
    <div class="bianju foot-xbj life_body">
    	<div class="row bianju foot-xbj">
    		<div class="col-xs-12">
    			<div class="col-xs-3 text-center">
    				<img src="<%url('user/img/bingxiang.png')%>" height="230" width="200" alt="">
    			</div>
    			<div class="col-xs-5" style="line-height: 30px;">
    				<div class="col-xs-12 foot-xbj earnings_size_day">{%value.name}
    				</div>
    				<div class="col-xs-12 bianju">价格：{%value.price}</div>
    				<div class="col-xs-12 no_padding">
    					<div class="col-xs-4 fr no_padding">
    						<a href="javascript:void(0);">
    							<i class="fa fa-share-alt"></i> 分享
    						</a>
    						<img src="<%url('user/img/weixin.jpg')%>" height="19" width="22" alt="">
    						<img src="<%url('user/img/xinlang.jpg')%>" height="19" width="22" alt="">
    					</div>
    					<div class="col-xs-3 fr">
    						<a href="javascript:;" ralate="{%value.id}" class="collect"><i class="{%isCollect(value.collect)}" ></i>收藏</a>
    					</div>
    				</div>
    			</div>
    			<div class="col-xs-4" style="line-height: 30px;">
    				{%html(value.content)}
    			</div>
    		</div>
    	</div>
    </div>
{%/each}
</script>

<script type="text/javascript">
var page = 1;
islodding = true;
 template.helper('isCollect', function (isCollect) {
 	if(isCollect)
 	{
 		return 'fa fa-star';
 	}
 	else
 	{
 		return 'fa fa-star-o';
 	}

  });

 template.helper("html", toHTML);

 function toHTML(str){
    return decodeURIComponent(str);
 }
$.get("life/life_list",{page:page,row:5},function (data){
	var html = template("lifeProduct", {list: data.data});
	$("#life").append(html);
	collect();
})

function collect(){
	$(".collect").bind("click", function(){
		_this = $(this);
		var relate_id = $(this).attr("ralate");
		$.post("<%url('collect/add_collect')%>", {
			type : 4,
			relate_id : relate_id
		}, function (datae){
			if(datae == 1){
				_this.find(".fa").attr("class", 'fa fa-star');
			}else if(datae == 0){
				_this.find(".fa").attr("class", 'fa fa-star-o');
			}
			else{
				window.location.href="<%url('login')%>";
			}
		})
	})
}
$(document).ready(function() {
    $(window).scroll(function() {
        // $(document).scrollTop() 获取垂直滚动的距离
        if ($(document).scrollTop() >= $(document).height() - $(window).height()) {
            $(".jiazai").css("display","block");
            page++;
            if (!islodding){
            	return;
            }
            $.get("life/life_list",{page:page,row:5},function (data){
            	islodding = false;
            	if(data.data){
            		 $(".jiazai").css("display","none");
            	}
			var html = template("lifeProduct", {list: data.data});
			$("#life").append(html);
            $(".collect").unbind("click");
			collect();
			islodding = true;
			})
        }
    })
});







</script>
</html>